<template>
    <div class="searchBox">
        <el-form ref="searchForm" :model="searchForm" :rules="rules" class="searchBar">
            <el-form-item prop="keyword">
                <el-input v-model="searchForm.keyword" placeholder="请输入学生姓名" clearable />
            </el-form-item>

            <el-button type="primary" :loading="searchLoading" @click="submitForm">搜索</el-button>
            <el-button type="primary" @click="senior">高级搜索</el-button>
        </el-form>
    </div>
</template>

<script>
import { searchStudent } from '@/api/student'
import { StuIdResTypeEnum } from 'bjtu-portrait-api'
import {ElMessage} from "element-plus";

export default {
    data() {
        return {
            searchForm: {
                keyword: '',
            },
            searchLoading: false,
            rules: {
                keyword: [
                    {
                        required: true,
                        message: '输入不能为空，请重新输入学生姓名',
                        trigger: 'blur',
                    },
                    {
                        pattern: /^[a-zA-Z\u4e00-\u9fa5\s]+$/,
                        message: '请输入中文或英文字符',
                        trigger: 'blur',
                    },
                    {
                        min: 1,
                        max: 20,
                        message: '姓名长度在 1 到 20 个字符之间',
                        trigger: 'blur',
                    },
                ],
            },
        }
    },

    methods: {
        async search(keyword) {
            try {
                const response = await searchStudent(keyword)
                const type = response.data.type
                if (type === StuIdResTypeEnum.NUMBER_1) {
                    // 成功返回学号，调用个人信息 API
                    this.$router.push({
                        name: 'StudentInfoPage',
                        params: { id: response.data.stuId },
                    })
                    console.log(response.data)
                } else if (type === StuIdResTypeEnum.NUMBER_2) {
                    // 处理重名情况，调用高级搜索姓名搜索 API
                    this.$router.push({
                        name: 'SeniorSearch',
                        query: { keyword: keyword },
                    })
                    console.log(response.data)
                } else if (type === StuIdResTypeEnum.NUMBER_3) {
                    // 其他错误情况，如未找到学生信息等
                    ElMessage('学生信息不存在，请更改后重新搜索')
                    console.log(response.data)
                }
            } catch (error) {
                console.error(error)
                alert('请求失败')
            }
        },

        validateForm() {
            return new Promise((resolve, reject) => {
                this.$refs.searchForm.validate((valid) => {
                    if (valid) {
                        resolve()
                    } else {
                        reject('表单验证失败！')
                        this.searchForm.keyword = ''
                    }
                })
            })
        },

        async submitForm() {
            try {
                const keyword = this.searchForm.keyword.trim()
                await this.validateForm()
                this.searchLoading = true
                await this.search(keyword)
            } catch (error) {
                console.log('error submit!', error)
            } finally {
                this.searchLoading = false
            }
        },

        // TODO：路由跳转逻辑调整
        async senior() {
            this.$router.push({
                name: 'SeniorSearch',
            })
        },
    },
}
</script>

<style lang="less" scoped></style>
